<template>
    <div class="goodsindex">
        <el-row :gutter="20" class="goodsindex-queryInfo">
       
        <el-col :xs="6" :sm="4" :md="3" :lg="2" :xl="2">
            <el-button type="success" class="goodsindex-queryInfo-li" size="small" @click="addPersonSummary()">添加</el-button>
        </el-col>
    </el-row>
        <!-- 检索结果 -->
        <el-row :gutter="20" class="goodsindex-list">
            <el-col :span="24">
                <el-table :data="tableData" border size='small' style="width: 100%">
                    <el-table-column type="index" :index="indexMethod" label="序号" width="50">
                    </el-table-column>
                    <el-table-column prop="summaryTitle" label="标题" width="400">
                    </el-table-column>
                    <el-table-column prop="statusName" label="状态" width="180">
                    </el-table-column>
                    <el-table-column prop="createTimeStr" label="编写时间" width="180">
                    </el-table-column>
                    <el-table-column prop="address" label="操作">
                        <template slot-scope="scope">
                            <el-button type="primary" icon="el-icon-edit" circle size="small"
                                @click="gotoDetail(scope.row.summaryId)"></el-button>
                            <el-button type="danger" icon="el-icon-delete" circle size="small"></el-button>
                        </template>
                    </el-table-column>
                </el-table>
            </el-col>
        </el-row>
        <!-- 分页 -->

        <el-row :gutter="20" class="goodsindex-list">
            <el-col :span="24" class="goodsindex-page-box">
                <el-pagination :page-size="pageSize" :current-page="pageNum" @current-change="handleCurrentChange"
                    class="article_pagination" background layout="prev, pager, next" :total="totalSize"></el-pagination>
            </el-col>
        </el-row>

    </div>
</template>

<script>
import { getSummaryList } from '@/assets/api/utils.js'
export default {
    data() {
        return {
            name: '',
            pageNum: 1,
            pageSize: 10,
            totalSize: 0,
            tableData: []
        }
    },
    created() {
        this.searchSummary();
    },
    methods: {

        handleCurrentChange(val) {
            var value = { "pageNum": val, "pageSize": this.pageSize };
            getSummaryList(value).then((resp) => {
                this.tableData = resp.data.content;
                this.totalSize = resp.data.totalSize;
            })
        },
        async searchSummary() {
            var value = { "pageNum": this.pageNum, "pageSize": this.pageSize };
            getSummaryList(value).then((resp) => {
                this.tableData = resp.data.content;
                this.totalSize = resp.data.totalSize;
            })
        },

        indexMethod(index) {
            return index + 1;
        },
        async addPersonSummary(){
            console.log("页面跳转")
            this.$router.push('/home/addSummary')
        },
        async gotoDetail(summaryId) {
            this.$router.push(`/home/editSummary/${summaryId}`)
        },
    }
}
</script>

<style scoped>
.goodsindex {
    width: 100%;
    min-height: 100%;
    padding: 15px;
    box-sizing: border-box;
}

/* 搜索 */
.goodsindex-queryInfo {
    margin-bottom: 10px;
}

.goodsindex-queryInfo-li {
    width: 100%;
    height: auto;
}

/* 列表 */
.goodsindex-list {
    width: 100%;
    height: auto;
    margin-bottom: 20px;
}

/* 分页 */
.goodsindex-page-box {
    width: 100%;
    height: auto;
    display: flex;
    justify-content: flex-end;
}
</style>